/** 组织架构**/
import React from 'react';
import { connect } from 'dva'
import { routerRedux } from 'dva/router';
import { Accordion, List } from 'antd-mobile';
import styles from './orgArchitecture.less'

class OrgArch extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  //== 生命周期 -- 页面渲染
  render() {
    return (
      <div>
        <div className={styles.hierarchy}>
          <span className={styles.hierarchyName}>机场网信</span>
          <span >></span>
          <span className={styles.hierarchyName}>自治区网信办</span>
          <span >></span>
          <span className={styles.hierarchyName}>党建处</span>
        </div>
        <Accordion defaultActiveKey="3">
          <Accordion.Panel header="自治区本级所属" key="1" onClick = {this.handleOrgDetail}>
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="乌鲁木齐市网信党工委" key="2">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="克拉玛依市网信党工委" key="3">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >克拉玛依简介</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >独山子区网信党工委</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >克拉玛依区网信党工委</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >白碱滩区网信党工委</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >乌尔禾区网信党工委</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="吐鲁番市网信党工委" key="4">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="哈密市网信党工委" key="5">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="昌吉回族自治州网信党工委" key="6">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
          <Accordion.Panel header="博尔塔拉蒙古自治州网信党工委" key="7">
            <List>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >1</span>
              </List.Item>
              <List.Item onClick = {this.handleOrgDetail}>
                <span className={styles.childOrg} >2</span>
              </List.Item>
            </List>
          </Accordion.Panel>
        </Accordion>
      </div>
    );
  }
  //组件控制函数
  // 点击跳转到组织详情
  handleOrgDetail = () => {
    this.props.dispatch(
      routerRedux.push({
        pathname: `/work/orgArchitecture/OrgDetail`,
        query: {}
      })
    );
  }
}

function mapStateToProps({ infor }){
    return {
      infor
      };
  }
export default connect(mapStateToProps)(OrgArch);
